<template>
  <div class="space-p">
    <h5 class="table-title space-m-b" v-if="title && title!==''">{{ title }}</h5>
    <div class="case-base-info space-m-b">
      <a-row :gutter="40">
        <a-col :md="9" :xs="24" :class="!isMobile() ? 'case-baseinfo-col' : null">
          <div class="case-user-card">
            <table>
              <tr>
                <td>
                  <figure>
                    <img :src="defaultData.userImg" />
                  </figure>
                </td>
                <td>
                  <p class="font-primary"><b>{{ dataList.baseInfo.patientName }}</b></p>
                  <p>{{ dataList.baseInfo.patientGender | patientGenderFilter }}</p>
                  <p>{{ dataList.baseInfo.patientAge }}岁</p>
                  <p>{{ dataList.baseInfo.csrq }}</p>
                  <p>{{ dataList.baseInfo.patientIdcard }}</p>
                </td>
              </tr>
            </table>
          </div>
        </a-col>
        <a-col :md="15" :xs="24">
          <div class="case-table-info th-center" style="padding: 20px 0;">
            <table>
              <tr>
                <th>转出医院</th>
                <td>{{ dataList.baseInfo.outHospitalName }}</td>
                <th>转诊流水号</th>
                <td>{{ dataList.baseInfo.outRecordId }}</td>
              </tr>
              <tr>
                <th>转入科室</th>
                <td>{{ dataList.baseInfo.inDeptName }}</td>
                <th>EMPI</th>
                <td>{{ dataList.baseInfo.empi }}</td>
              </tr>
              <tr>
                <th>住院类型</th>
                <td>{{ dataList.baseInfo.patientType | patientTypeFilter }}</td>
                <th></th>
                <td></td>
              </tr>
              <tr>
                <th>保险类型</th>
                <td>{{ dataList.baseInfo.patientMedicareType | patientMedicareTypeFilter }}</td>
                <th></th>
                <td></td>
              </tr>
            </table>
          </div>
        </a-col>
      </a-row>
    </div>
    <div class="case-tabs">
      <a-card
        style="width:100%;"
        size="small"
        :tab-list="tabList"
        :active-tab-key="tabKey"
        @tabChange="key => onTabChange(key, 'tabKey')"
      >
        <div v-if="tabKey === 'refLab'">
          <a-collapse v-model="panelActiveKey" expandIconPosition="right" :bordered="false">
            <a-collapse-panel :key="key" v-for="key in new Array(1)">
              <h5 class="table-title" slot="header">指标分析</h5>
              <div class="case-table-info row-border">
                <table>
                  <thead>
                    <tr><th>检测指标项目</th><th>检测结果</th><th>检测计量单位</th><th>参考值范围</th><th>结果提示</th></tr>
                  </thead>
                  <tbody>
                    <tr :key="subindex" v-for="(subitem,subindex) in dataList.refLab">
                      <td>{{ subitem.jyzbxmmc }}</td><td>{{ subitem.jyjgdx || subitem.jyjgdl }}</td><td>{{ subitem.jyjldw }}</td><td>{{ subitem.ckzfw }}</td><td>{{ subitem.jgtsdm }}</td>
                    </tr>
                  </tbody>
                </table>
              </div>
            </a-collapse-panel>
          </a-collapse>
        </div>
        <div v-else-if="tabKey === 'refMedication'">
          <div class="case-table-info row-border">
            <table>
              <thead>
                <tr><th>处方号</th><th>药物名称</th><th>规格</th><th>总量</th><th>剂量</th><th>频次</th><th>药物使用方式</th></tr>
              </thead>
              <tbody>
                <tr :key="subindex" v-for="(subitem,subindex) in dataList.refMedication">
                  <td>{{ subitem.cfh }}</td><td>{{ subitem.ypmc }}</td><td>{{ subitem.ypgg }}</td>
                  <td>{{ subitem.ypsyzsl + subitem.ypsysldw }}</td><td>{{ subitem.ypsycjl+subitem.ypsyjldw }}</td>
                  <td>{{ subitem.ypsyplmc }}</td><td>{{ subitem.ypsytjmc }}</td>
                </tr>
              </tbody>
            </table>
          </div>
        </div>
        <div v-else-if="tabKey === 'refExamine'">
          <a-collapse v-model="panelExamineActiveKey" expandIconPosition="right" :bordered="false">
            <a-collapse-panel :key="index" v-for="(item,index) in dataList.refExamine">
              <h5 class="table-title" slot="header">{{ item.jcxmmc }}</h5>
              <div class="case-table-info row-border">
                <table>
                  <tbody>
                    <tr>
                      <td>影像表现或检查所见</td><td colspan="3">{{ item.jcjg }}</td>
                    </tr><tr>
                      <td> 检查诊断或提示</td><td colspan="3">{{ item.jczdhts }}</td>

                    </tr>
                    <tr>
                      <td>申请医生：{{ item.bgysxm }}</td>
                      <td>检查医生：{{ item.jcysxm }}</td>
                      <td>检查时间：{{ item.jcsj }}</td>
                      <td>签字：</td>
                    </tr>
                  </tbody>
                </table>
              </div>
            </a-collapse-panel>
          </a-collapse>
        </div>
        <div v-else-if="tabKey === 'refSign'">
          <a-collapse v-model="panelRefSignActiveKey" expandIconPosition="right" :bordered="false">
            <a-collapse-panel :key="key" v-for="key in new Array(1)">
              <h5 class="table-title" slot="header">体征情况</h5>
              <div class="case-table-info row-border">
                <table>
                  <thead>
                    <tr><th>名称</th><th>测量时间</th><th>测量值</th></tr>
                  </thead>
                  <tbody>
                    <tr :key="subindex" v-for="(subitem,subindex) in dataList.refSign">
                      <td>{{ subitem.tzxmmc }}</td><td>{{ subitem.djsj }}</td><td>{{ subitem.tzxmz }}</td>
                    </tr>
                  </tbody>
                </table>
              </div>
            </a-collapse-panel>
          </a-collapse>
        </div>
        <div v-else-if="tabKey === 'refDiagnosis'">
          <div class="case-table-info row-border">
            <table>
              <thead>
                <tr><th>诊断号</th><th>诊断类型</th><th>诊断名称</th><th>诊断类别</th><th>主要诊断</th><th>疑似诊断</th></tr>
              </thead>
              <tbody>
                <tr :key="subindex" v-for="(subitem,subindex) in dataList.refDiagnosis">
                  <td>{{ subitem.zddm }}</td><td>{{ subitem.zdlxdm }}</td><td>{{ subitem.zdmc }}</td><td>{{ subitem.zdlbdm }}</td><td>{{ subitem.zyzdbz }}</td><td>{{ subitem.yszdbz }}</td>
                </tr>
              </tbody>
            </table>
          </div>
        </div>
        <div v-else-if="tabKey === 'refOperation'">
          <div class="case-table-info row-border">
            <table key="refOperation">
              <thead>
                <tr><th>手术号</th><th>操作名称</th><th>操作部位</th><th>操作级别</th><th>开始时间</th><th>结束时间</th><th>操作人</th></tr>
              </thead>
              <tbody>
                <tr :key="subindex" v-for="(subitem,subindex) in dataList.refOperation">
                  <td>{{ subitem.ssczdm }}</td><td>{{ subitem.ssczmc }}</td><td>{{ subitem.ssbwmc }}</td>
                  <td>{{ subitem.ssjbdm }}</td><td>{{ subitem.sskssj }}</td>
                  <td>{{ subitem.ssjssj }}</td><td>{{ subitem.updateBy }}</td>
                </tr>
              </tbody>
            </table>
          </div>
        </div>
      </a-card>
    </div>
  </div>
</template>

<script>
import moment from 'moment'
import { mixin, mixinDevice } from '@/utils/mixin'
import { selElectronicRecords } from '@/api/referral'
export default {
  name: 'RollinCase',
  components: {},
  mixins: [mixin, mixinDevice],
  props: {
    title: {
      type: String,
      default: '基本信息'
    },
    showSubmit: {
      type: Boolean,
      default: false
    },
    status: {
      type: String,
      default: 'add'
    },
    data: {
      type: Object,
      default: null
    },
    disabledList: {
      type: Array,
      default: null
    }
  },
  data () {
    return {
      // pageStatus: this.status, // edit|add|details
      tabList: [
        {
          key: 'refLab',
          tab: '检验信息'
        },
        {
          key: 'refMedication',
          tab: '用药信息'
        },
        {
          key: 'refExamine',
          tab: '检查信息'
        },
        {
          key: 'refSign',
          tab: '体征信息'
        },
        {
          key: 'refDiagnosis',
          tab: '诊断信息'
        },
        {
          key: 'refOperation',
          tab: '手术信息'
        }
      ],
      tabKey: 'refLab',
      panelActiveKey: ['0', '1', '2'],
      panelRefSignActiveKey: ['0', '1', '2'],
      panelExamineActiveKey: ['0', '1', '2'],
      dataList: {
        refLab: null,
        refMedication: null,
        refExamine: null,
        refSign: null,
        refDiagnosis: null,
        baseInfo: {

        }
      },
      defaultData: {
        outRecordId: '',
        userImg: require('@/assets/images/user-space.png')
      }
    }
  },
  created () {
    // 初始化默认数据
    this.data && (this.defaultData = Object.assign({}, this.defaultData, this.data))
    this.dataInit()
    // 初始化检验信息
    this.dataInit('refLab')
  },
  methods: {
    moment,
    getData (record, type, call) {
      // 1-基本信息，2-体征信息，3-诊断信息，4-用药信息，5-检验信息，6-检查信息，7-手术信息，8-门诊信息，9-入院信息，10-出院信息
      selElectronicRecords({
        outRecordId: record.outRecordId,
        eleType: String(type),
        zyh: record.zyh,
        pageNum: '',
        pageSize: 10
      }).then((res) => {
        if (res.code === 200) {
          res.data.rows && call && call(res.data)
        } else {
          this.$message.error(res.message)
        }
      }).catch((err) => {
        this.$message.error(err.message)
      })
    },
    dataInit (key) {
      switch (key) {
        case 'refLab':
          this.getData(this.data, 5, (res) => {
            console.log('检验信息', res)
            const data = res.rows
            this.dataList.refLab = data
          })
          break
        case 'refMedication':
          this.getData(this.data, 4, (res) => {
            console.log('用药信息', res)
            const data = res.rows
            this.dataList.refMedication = data
          })
          break
        case 'refExamine':
          this.getData(this.data, 6, (res) => {
            console.log('检查信息', res)
            const data = res.rows
            this.dataList.refExamine = data
          })
          break
        case 'refSign':
          this.getData(this.data, 2, (res) => {
            console.log('体征信息', res)
            const data = res.rows
            this.dataList.refSign = data
          })
          break
        case 'refDiagnosis':
          this.getData(this.data, 3, (res) => {
            console.log('诊断信息', res)
            const data = res.rows
            this.dataList.refDiagnosis = data
          })
          break
        // case 'refOperation':
        //   this.getData(this.data, 7, (res) => {
        //     console.log('手术信息', res)
        //     const data = res.rows
        //     this.dataList.refOperation = data
        //     console.log('this.dataList.refOperation', this.dataList.refOperation)
        //   })
        //   break
        default:
          // 获取基本信息
          this.getData(this.data, 1, (res) => {
            console.log('baseInfo', res)
            const data = res.rows[0]
            this.dataList.baseInfo = Object.assign({}, this.defaultData, data)
            // 在promise中回调函数数据字段为空，直接赋值会捕获错误
            // this.dataList.baseInfo.empi = data.empi
            // this.dataList.baseInfo.csrq = data.csrq
          })
          this.getData(this.data, 7, (res) => {
            console.log('手术信息', res)
            const data = res.rows
            this.dataList.refOperation = data
            console.log('this.dataList.refOperation', this.dataList.refOperation)
          })
          break
      }
    },
    onTabChange (key, type) {
      console.log(key, type)
      this[type] = key
      this.$nextTick(() => {
        this.dataInit(key)
      })
    }
  }
}
</script>

<style lang="less">

</style>
